@import "public";

@media screen and (min-width: 800px) and (max-width: 1660px){
  .index-activity{bottom: -.65rem;
    &:before, &:after{right: .5rem}
    .title{height: 1.1rem}
    .list{
      dd a{height: .5rem; line-height: .5rem}
      .arrow{padding-top: .15rem}
    }
  }
  .index-brand{width: 2.4rem; height: 2.4rem; left: 3.7rem; bottom: .2rem; padding: 0 .1rem;
    .title{padding: .5rem 0 .4rem 0}
  }
}

@media screen and (max-width: 800px){
  html{font-size: 50px}
  body.noscroll{overflow: hidden}
  .wal{max-width: 8rem}

  $headH:1.08rem;
  body.navShow{overflow: hidden;
    .g-head .navA{background-image: url("../image/close.png")}
    .g-nav{right: .13rem; left: .13rem}
  }
  .g-headD{height: $headH}
  .g-head{
    .wal{min-height: $headH}
    .navA{display: block; @include absolute($t:.12rem, $l: 1.65rem); width: 1rem; height: .83rem; @include radius(.18rem); background: rgba(0, 0, 0, .5) url("../image/navA.png") center no-repeat; background-size: .4rem}
    .side{right: 0;
      ul.btn{
        li.search{
          .form{height: .42rem; margin-top: -.21rem;
            .input input{height: .42rem; line-height: .42rem; font-size: .22rem}
            .submit{width: .52rem}
          }
        }
      }
      dl.btn{
        dd{margin-left: .22rem}
        a{font-size: .22rem}
      }
    }
  }
  .g-nav{top: $headH; left: -100%; right: 120%; bottom: .13rem; position: fixed; padding: .3rem .5rem;
    li{width: 100%}
    a.name{height: 1rem; line-height: 1rem; font-size: .26rem;
      &:before{left: 0}
      &.on{font-weight: bold}
    }
  }

  .g-foot{font-size: .24rem; text-align: center; justify-content: center; -webkit-justify-content: center; padding: .3rem 0; line-height: 1.7em; height: auto;
    .col{padding-top: .1rem; font-size: .22rem;
      p{padding-left: 0; width: 100%}
    }
  }

  .index-foot{font-size: .2rem; left: .4rem; line-height: 1.3em;
    .list{margin-left: -.1rem}
  }

  /*index*/
  .indexFlash{
    li{
      .video{display: none}
      .layer{left: .5rem; right: .5rem; bottom: 3rem;
        .name{font-size: .5rem; width: 100%}
        .msg{font-size: .24rem}
        .more a{font-size: .22rem; width: 1.7rem; height: .57rem; line-height: .55rem}
      }
    }
  }

  .index-activity{min-height: 4.8rem; padding: 0 .8rem 0 0;
    .title{
      h2{font-size: .26rem}
    }
    .list{margin-top: -.2rem;
      dd{font-size: .22rem;
        a{line-height: .65rem; height: .65rem}
      }
      .arrow{padding-top: .2rem}
    }
  }

  .index-brand{left: 4.5rem; bottom: .5rem;
    .title{font-size: .26rem}
  }

  /*page*/
  .p-banner{
    .form{height: .7rem;
      .input input{height: .7rem; line-height: .7rem; font-size: .24rem}
      .submit{width: .8rem;
        input{height: .7rem}
      }
    }
  }

  .shop-nav{min-height: 1rem;
    .list{padding: .2rem 0 .2rem 0; margin-left: -.15rem;
      li{padding-left: .45rem}
      a{height: .6rem; line-height: .6rem; font-size: .24rem}
    }
    a.btn{line-height: 1rem; right: .3rem; font-size: .26rem; display: none}
    a.back{line-height: 1rem; font-size: .24rem}
  }

  .shop-list{padding: .5rem .2rem 0 .2rem;
    ul{margin-left: -.3rem}
    li{width: 50%; padding: 0 0 .3rem .3rem;
      a{letter-spacing: 0; font-size: .24rem;
        .name{line-height: .36rem; padding-top: .2rem}
      }
    }
  }

  .p-more a{width: 2.2rem; height: .57rem; line-height: .55rem; font-size: .24rem}

  .shop-foot{
    .wal{min-height: 4.5rem}
  }

  .shop-show{padding: 1.15rem .3rem .5rem .3rem;
    .title{
      .img{padding: .8rem 0 0 0}
      p{bottom: .5rem; font-size: .22rem}
    }
    .img-list{width: 100%;
      li{height: 5rem}
      .num{font-size: .24rem}
    }
    .container{width: 100%; min-height: 1rem; border: 0; border-top: #fff solid 2px; font-size: .24rem; line-height: .44rem; padding: 0 .3rem;
      .content{min-height: 1rem; padding: .3rem 0}
      .msg{padding: .3rem 0}
    }
  }

  .shop-show2{
    .title{
      div{font-size: .24rem}
    }
    .img{padding: .6rem 0 0 0}
  }

  .shop-layer .container{padding: .25rem;
    .side-btn{position: relative; width: 100%; border: 0; border-bottom: #e5e5e5 solid 1px;
      ul{display: flex; display: -webkit-flex; flex-direction: row-reverse; -webkit-flex-direction: row-reverse}
      li{width: 20%}
      a{height: .8rem; font-size: .3rem}
    }
    .shop-box{width: 100%; height: 40vh; padding: .2rem;
      .control{left: .2rem;
        a{width: .38rem; height: .38rem}
      }
    }
    .side{width: 100%; height: 40vh; border: 0;
      .form{padding: .15rem .2rem;
        .input{
          input{height: .7rem; line-height: .7rem; font-size: .24rem}
        }
        .submit{top: .15rem; right: .2rem; bottom: .15rem; width: 1rem;
          input{height: .7rem}
        }
      }
      .list{top: 1rem; padding-top: 0;
        li{
          .name{height: .7rem; line-height: .7rem; font-size: .28rem}
          dl{
            a{font-size: .24rem; height: .6rem; line-height: .6rem}
          }
        }
      }
    }
  }

  #shop{
    .tips-layer{font-size: .2rem; line-height: .22rem}
  }

  .loading{
    .container{width: 7rem; flex-direction: column; -webkit-flex-direction: column}
    a.btn{font-size: .24rem}
    .line{margin-left: 0; margin-right: 0; margin-bottom: .5rem; margin-top: .3rem}
  }


}
@media screen and (max-width: 550px){
  .wal{margin: 0 .2rem}
}